
import {IAxisChartConfig,DataSourceMgr,ChartConfigMgr,ChartIdMap,effect} from "@/index"
export default function(
    chartTarget?:ChartConfigMgr<IAxisChartConfig>,
    dataSource?:DataSourceMgr,
    reRender?:()=>void,
    destroyMySelf?:()=>void
    ){
    const container = document.getElementById(chartTarget?.getConfig("container"));
    const innerSpan = document.createElement("span");
    const innerButton = document.createElement("button");
    if(container){
        container.innerHTML = "";
        container.append(innerSpan);
        container.append(innerButton);
    }
    innerButton.innerText="点击我进行下钻"
    innerButton.addEventListener("click",function(){
        const events = chartTarget?.getConfig("events");
        if(events["button1"].type=="setFilter"){
            /**
             * 该属性由图表组件自动生成，当用户点击触发当前图标的时候，图标的返回数据就是这个属性
             */
            const params = {
                id:10,
                name:"南京"
            }
            const newChart = ChartIdMap.get(events["button1"].target);
            newChart?.self.setDataSourceFilter(params);
        }else if(events["button1"].type=="redirect"){
            console.log(destroyMySelf);
            destroyMySelf && destroyMySelf();
            const newChart = ChartIdMap.get(events["button1"].target);
            newChart?.self.render();
        }
        console.log(chartTarget?.getConfig());
    },false);
    effect(()=>{
        innerSpan.innerHTML = chartTarget?.getConfig("title")||"空空如也";
    },[chartTarget]);

    effect(()=>{
        console.log("dataSource，指定重绘区域工作，"+chartTarget?.getConfig("id"))
        console.log(dataSource?.getFilter())
        innerSpan.innerHTML = chartTarget?.getConfig("title")||"空空如也";
    },[dataSource]);
}